<template>
  <div id="app">
    <h1>路由组件</h1>
    <!-- 配置好了路由就会生成两个方法 -->
    <el-menu :default-active="'1'" class="el-menu-demo" mode="horizontal">
      <el-menu-item index="1">
        <router-link to="/home" class="header">home组件</router-link>
      </el-menu-item>
      <el-menu-item index="1">
        <router-link to="/about" class="header">about组件</router-link>
      </el-menu-item>
    </el-menu>

    <router-view />
  </div>
</template>

<script>
export default {
  name: "app",
  components: {},
};
</script>
  
<style>
.header {
  text-decoration: none;
  font-size: 20px;
  color: skyblue !important;
}
</style>
